<template>
  <div class="trainReserve">
    <!-- <crumbs :BreadCrumb="BreadCrumb"></crumbs> -->
    <el-form ref="form" :inline="true" :rules="rules" :model="form" label-width="80px">
      <div class="screen">
        <el-form-item label="出发城市" prop="depart">
          <!-- <el-select v-model="form.depart" clearable filterable placeholder="请选择" :filter-method="pinyingMatch"> -->
          <el-select v-model="form.depart" clearable filterable placeholder="请选择" :disabled="this.type=='change'">
            <el-option v-for="(item,index) in restaurants" :key="index" :label="item.value" :value="item.label">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="到达城市" prop="arrive">
          <!-- <el-select v-model="form.arrive" clearable filterable placeholder="请选择" :filter-method="pinyingMatch"> -->
          <el-select v-model="form.arrive" clearable filterable placeholder="请选择">
            <el-option v-for="(item,index) in restaurants" :key="index" :label="item.value" :value="item.label">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="出发时间" prop="traintime">
          <el-date-picker :picker-options="pickerBeginDateBefore" type="date" placeholder="选择日期"
            v-model="form.traintime" :value-format="format" ref="arrive" @keyup.enter.native="onSubmit('form')">
          </el-date-picker>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit('form')">搜索</el-button>
          <el-button type="primary" @click="createSearch()">新建标签页搜索</el-button>
        </el-form-item>
      </div>
      <div class="screen3">
        <div class="screen4">
          <div class="screen1">
            <el-form-item label="车型">
              <el-checkbox-group v-model="form.type">
                <el-checkbox v-for="(item, index) in list" :key="index" :label="item.name" :value="item.is" name="type"
                  @change="getshow(index)"></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </div>
          <div class="screen1">
            <el-form-item label="发车">
              <el-radio-group v-model="form.resource" @input="inputResource($event,'resource')">
                <el-radio v-for="(item, index) in timeList" :key="index" :label="item.time1"></el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <div :class="open ? 'screen1' : 'see'">
            <el-form-item label="到达">
              <el-radio-group v-model="form.resource1" @input="inputResource($event,'resource1')">
                <el-radio v-for="(item, index) in timeList1" :key="index" :label="item.time1" ></el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <div class="screen1" v-if="open">
            <el-form-item label="发站">
              <el-radio-group v-model="form.start" @change="desChange">
                <el-radio v-for="(item, index) in departureList" :key="index" :label="item" :value="item"></el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <div class="screen1" v-if="open">
            <el-form-item label="到站">
              <el-radio-group v-model="form.arrives" @change="arrChange">
                <el-radio v-for="(item, index) in destinationList" :key="index" :label="item" :model="item"></el-radio>
              </el-radio-group>
            </el-form-item>
          </div>
          <!-- <div class="screen1" v-if="open">
            <el-form-item label="始发/经停">
              <el-radio-group v-model="form.originating" @change="originatingchange">
                <el-radio label="">不限</el-radio>
                <el-radio label="true">始发</el-radio>
                <el-radio label="false">路过</el-radio>
              </el-radio-group>
            </el-form-item>
          </div> -->
        </div>
        <el-form-item>
          <el-button @click="btnClick" class="btn_click" type="primary">{{ open ? "收起" : "展开"
            }}<i v-if="open" class="el-icon-arrow-up"></i><i v-if="!open" class="el-icon-arrow-down"></i></el-button>
        </el-form-item>
      </div>
    </el-form>
    <div class="train">
      <div class="train_o">
        <span v-for="(item, index) in trainh" :key="index">{{
          item.names
        }}</span>
      </div>
      <div v-for="(item, index) in train" :key="index">
        <div class="details">
          <div class="det_o">
            {{ item.train_code }}
            <span class="details_x" @click="trainDetails(item, index)">详情</span>
          </div>
          <div class="det_tw">
            <span class="">{{ item.start_time }}</span>
            <div class="daysed">
              <span class="">{{ item.arrive_time }}</span>
              <span v-if="item.arrive_days != 0" class="days">+{{ item.arrive_days }}</span>
            </div>
          </div>
          <div class="det_tw">
            <span>
              <!-- 经停信息 -->
              <span
                style="color:#00CC00;">{{item.fromStationSite=='originate' ?'始发' :item.fromStationSite=='passingBy' ?'路过' :"终点"}}</span>
              {{ item.from_station_name }}</span>
            <span>
              <!-- 经停信息 -->
              <span style="color:#00CC00;">
                {{item.toStationSite=='originate' ?'始发':item.toStationSite=='passingBy' ?'路过' :"终点"}}</span>
              {{ item.to_station_name }}</span>
          </div>
          <div class="det_fo" v-if="item.run_time!='99:59'">{{ runtime(item.run_time) }}</div>
          <div class="det_fo" v-if="item.run_time=='99:59'">列车运行图调整,暂停发售</div>
          <div class="det_fi">
            <div v-if="item.swz_num != '--'">
              商务座:
              <span>{{ item.swz_price }}元</span>
            </div>
            <div v-if="item.tdz_num != '--'">
              特等座:
              <span>{{ item.tdz_price }}元</span>
            </div>
            <div v-if="item.dw_num != '--'">
              动卧:
              <span>{{ item.dw_price }}元</span>
            </div>
            <div v-if="item.ydz_num != '--'">
              一等座:
              <span>{{ item.ydz_price }}元</span>
            </div>
            <div v-if="item.edz_num != '--'">
              二等座:
              <span>{{ item.edz_price }}元</span>
            </div>
            <div v-if="item.gjrw_num != '--'">
              高级软卧:
              <span>{{ item.gjrw_price }}元</span>
            </div>
            <div v-if="item.rw_num != '--'">
              软卧:
              <span>{{ item.rw_price }}元</span>
            </div>
            <div v-if="item.yw_num != '--'">
              硬卧:
              <span>{{ item.yw_price }}元</span>
            </div>
            <div v-if="item.rz_num != '--'">
              软座:
              <span>{{ item.rz_price }}元</span>
            </div>
            <div v-if="item.yz_num != '--'">
              硬座:
              <span>{{ item.yz_price }}元</span>
            </div>
            <div v-if="item.wz_num != '--'">
              无座:
              <span>{{ item.wz_price }}元</span>
            </div>
          </div>
          <div class="det_s">
            <div class="num">
              <div v-if="item.swz_num != '--'">
                <span style="color:red;" v-if="item.swz_num <= 20 && item.swz_num > 0">{{ item.swz_num }}张</span>
                <span style="color:#00CC00;" v-if="item.swz_num > 20">充足</span>
                <span v-if="item.swz_num == '0'">无票</span>
                <el-row>
                  <el-button v-if="item.swz_num != '0'" type="warning" class="btns"
                    @click="generate(item,item.swzName,item.swz_price,'9')">预订
                  </el-button>
                </el-row>
              </div>
              <div v-if="item.tdz_num != '--'">
                <span style="color:red;" v-if="item.tdz_num <= 20 && item.tdz_num > 0">{{ item.tdz_num }}张</span>
                <span v-if="item.tdz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.tdz_num > 20">充足</span>
                <el-button v-if="item.tdz_num != '0'" type="warning" class="btns" @click="generate(item,item.tdzName,item.rdz_price,'P')">
                  预订</el-button>
              </div>
              <div v-if="item.dw_num != '--'">
                <span style="color:red;" v-if="item.dw_num <= 20 && item.dw_num > 0">{{ item.dw_num }}张</span>
                <span v-if="item.dw_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.dw_num > 20">充足</span>
                <el-button v-if="item.dw_num != '0'" type="warning" class="btns" @click="generate(item,item.dwName,item.dw_price,'F')">预订
                </el-button>
              </div>
              <div v-if="item.ydz_num != '--'">
                <span style="color:red;" v-if="item.ydz_num <= 20 && item.ydz_num > 0">{{ item.ydz_num }}张</span>
                <span v-if="item.ydz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.ydz_num > 20">充足</span>
                <el-row>
                  <el-button v-if="item.ydz_num != '0'" type="warning" class="btns"
                    @click="generate(item,item.ydzName,item.ydz_price,'M')">预订
                  </el-button>
                </el-row>
              </div>
              <div v-if="item.edz_num != '--'">
                <span style="color:red;" v-if="item.edz_num <= 20 && item.edz_num > 0">{{ item.edz_num }}张</span>
                <span v-if="item.edz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.edz_num > 20">充足</span>
                <el-row>
                  <el-button v-if="item.edz_num != '0'" type="warning" class="btns"
                    @click="generate(item,item.edzName,item.edz_price,'O')">预订
                  </el-button>
                </el-row>
              </div>
              <div v-if="item.gjrw_num != '--'">
                <span style="color:red;" v-if="item.gjrw_num <= 20 && item.gjrw_num > 0">{{ item.gjrw_num }}张</span>
                <span v-if="item.gjrw_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.gjrw_num > 20">充足</span>
                <el-button v-if="item.gjrw_num != '0'" type="warning" class="btns"
                  @click="generate(item,item.gjrwName,item.gjrw_price,'6')">预订
                </el-button>
              </div>
              <div v-if="item.rw_num != '--'">
                <span style="color:red;" v-if="item.rw_num <= 20 && item.rw_num > 0">{{ item.rw_num }}张</span>
                <span v-if="item.rw_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.rw_num > 20">充足</span>
                <el-button v-if="item.rw_num != '0'" type="warning" class="btns" @click="generate(item,item.rwName,item.rw_price,'4')">预订
                </el-button>
              </div>
              <div v-if="item.yw_num != '--'">
                <span style="color:red;" v-if="item.yw_num <= 20 && item.yw_num > 0">{{ item.yw_num }}张</span>
                <span v-if="item.yw_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.yw_num > 20">充足</span>
                <el-button v-if="item.yw_num != '0'" type="warning" class="btns" @click="generate(item,item.ywName,item.yw_price,'3')">预订
                </el-button>
              </div>
              <div v-if="item.rz_num != '--'">
                <span style="color:red;" v-if="item.rz_num <= 20 && item.rz_num > 0">{{ item.rz_num }}张</span>
                <span v-if="item.rz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.rz_num > 20">充足</span>
                <el-button v-if="item.rz_num != '0'" type="warning" class="btns" @click="generate(item,item.rzName,item.rz_price,'2')">预订
                </el-button>
              </div>
              <div v-if="item.yz_num != '--'">
                <span style="color:red;" v-if="item.yz_num <= 20 && item.yz_num > 0">{{ item.yz_num }}张</span>
                <span v-if="item.yz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.yz_num > 20">充足</span>
                <el-button v-if="item.yz_num != '0'" type="warning" class="btns"
                  @click="generate(item,item.yzName,item.yz_price,'1')">预订</el-button>
              </div>
              <!-- <div v-if="item.yz_num == '--'">
                <span v-if="item.yz_num == '--'">无座</span>
              </div> -->
              <div v-if="item.wz_num != '--'">
                <span style="color:red;" v-if="item.wz_num <= 20 && item.wz_num > 0">{{ item.wz_num }}张</span>
                <span v-if="item.wz_num == '0'">无票</span>
                <span style="color:#00CC00;" v-if="item.wz_num > 20">充足</span>
                <el-button v-if="item.wz_num != '0'" type="primary" class="btns" @click="generate(item,item.wzName,item.wz_price,'0')">预订
                </el-button>
              </div>
            </div>
            <div class="reservation"></div>
          </div>
        </div>
        <div class="stopping" v-if="item.is">
          <div class="stop">
            <span>站次</span>
            <span>站名</span>
            <span>到时</span>
            <span>发时</span>
            <span>停留</span>
          </div>
          <div class="stop_mes" v-for="(item, index) in transitlist" :key="index">
            <span>{{ index + 1 }}</span>
            <span>{{ item.station_name }}</span>
            <span>{{ item.arrive_time }}</span>
            <span>{{ item.start_time }}</span>
            <span>{{ item.stopover_time }}</span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import crumbs from "../../components/Crumbs.vue";
  import Generate from "../traindetails/generate.vue";
  import pinyingMatch from 'pinyin-match';
  export default {
    name: "trainReserve",
    components: {
      crumbs,
      Generate,
    },
    data() {
      return {
        BreadCrumb: [{
          path: "/train/trainReserve",
          name: "火车票预定"
        }],
        pickerBeginDateBefore: {
          disabledDate(time) {
            return time.getTime() < Date.now() - 8.64e7;
          },
          shortcuts: [{
            text: '今天',
            onClick(picker) {
              picker.$emit('pick', new Date());
            }
          }, {
            text: '明天',
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() + 3600 * 1000 * 24);
              picker.$emit('pick', date);
            }
          }, {
            text: '后天',
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() + 3600 * 1000 * 24 * 2);
              picker.$emit('pick', date);
            }
          }]
        },
        go: "",
        loading: true,
        resData: {},
        verification: false,
        // 嵌套内容
        formLabelAlign: {
          userName: "",
          password: "",
          passwordAgion: "",
          name: "",
          type: this.$route.params.type ? this.$route.params.type : "",
          idNumber: "",
          phone: "",
        },
        cities: [{
            value: "1",
            label: "中国居民身份证",
          },
          {
            value: "2",
            label: "港澳台居民居住证",
          },
          {
            value: "C",
            label: "港澳居民来往内地通行证",
          },
          {
            value: "G",
            label: "台湾居民来往大陆通行证",
          },
          {
            value: "B",
            label: "护照",
          },
          {
            value: "H",
            label: "外国人永久居留身份证",
          },
        ],
        value: "",
        // 乘客类型
        cities1: [{
            value2: "1",
            label: "成人票",
          },
          {
            value2: "2",
            label: "儿童票",
          },
          {
            value2: "3",
            label: "学生票",
          },
          {
            value2: "4",
            label: "残疾军人、伤残人民警察",
          },
        ],
        value2: "",
        labelPosition: "right",
        innerVisible: false,
        radio: "0",
        trainAccount: "", //账户
        pass: "", //密码
        centerDialogVisible: false,
        // 登录返回数据
        loginList: {},
        isPass: "",
        train: [],
        open: true,
        mes: this.$route.params.mes,
        type: this.$route.params.type ? this.$route.params.type : "",
        format: "yyyy-MM-dd",
        form: {
          depart: "",
          arrive: "",
          traintime: "",
          type: [],
          resource: "",
          desc: "",
          start: "不限",
          arrives: "不限",
          startarr: "",
          originating: "",
        },
        rules: {
          depart: [{
            required: true,
            message: "请选择出发城市",
            trigger: "change"
          }, ],
          arrive: [{
            required: true,
            message: "请选择到达城市",
            trigger: "change"
          }, ],
          traintime: [{
            required: true,
            message: "请选择出发日期",
            trigger: "change"
          }, ],
        },
        cityList: [],
        list: [
          // {
          //   id: 0,
          //   name: "不限",
          //   type: ['abcd'],
          //   is: true,
          // },
          {
            id: 1,
            name: "G高铁/D动车",
            type: ["G", "D"],
            linshiType:["Z", "K", "T"],
            is: false,
          },
          {
            id: 2,
            name: "快车（Z/T/K）",
            type: ["Z", "K", "T"],
            linshiType:["G","D"],
            is: false,
          },
          {
            id: 3,
            name: "L/临客/普快",
            type: ["Z", "K", "T","G", "D"],
            linshiType:["Z", "K", "T","G", "D"],
            is: false,
          },
        ],
        timeList: [{
            id: 0,
            time: 0,
            times: 600,
            time1: "00:00-06:00",
            is: false,
          },
          {
            id: 1,
            time: 600,
            times: 1200,
            time1: "06:00-12:00",
            is: false,
          },
          {
            id: 2,
            time: 1200,
            times: 1800,
            time1: "12:00-18:00",
            is: false,
          },
          {
            id: 3,
            time: 1800,
            times: 2400,
            time1: "18:00-24:00",
            is: false,
          },
          {
            id: 4,
            time: 0,
            times: 2400,
            time1: "不限",
            is: false,
          },
        ],
        timeList1: [{
            id: 0,
            time: 0,
            times: 600,
            time1: "00:00-06:00",
            is: false,
          },
          {
            id: 1,
            time: 600,
            times: 1200,
            time1: "06:00-12:00",
            is: false,
          },
          {
            id: 2,
            time: 1200,
            times: 1800,
            time1: "12:00-18:00",
            is: false,
          },
          {
            id: 3,
            time: 1800,
            times: 2400,
            time1: "18:00-24:00",
            is: false,
          },
          {
            id: 4,
            time: 0,
            times: 2400,
            time1: "不限",
            is: false,
          },
        ],
        timeFilter:{},
        // 始发
        startarrList1: [{
            id: 0,
            names: "始发",
          },
          {
            id: 1,
            names: "路过",
          },
        ],
        // 发站
        departureList: [],
        // 到站
        destinationList: [],
        trainh: [{
            id: 0,
            names: "车次",
          },
          {
            id: 1,
            names: "	出发/到达时间",
            is: false,
          },
          {
            id: 2,
            names: "出发/到达车站",
          },
          {
            id: 3,
            names: "耗时",
            is: false,
          },
          {
            id: 4,
            names: "票价",
          },
          {
            id: 4,
            names: "票量",
          },
        ],
        cityLists: [],
        // 经停
        transitlist: [],
        rawlist: [],
        randCode: "",
        arr: {},
        restaurants: [],
        restaurants2: [],
        restaurants3: [],
        // 核对改签信息
      };
    },
    props: {},
    components: {},
    methods: {
      // 始发 路过 不限点击事件
      originatingchange() {
        if (this.rawlist.length == 0) {
          this.form.originating = ''
          this.$message({
            message: '请查询后进行筛选',
            type: 'warning'
          });
        } else {
          this.showLoading();
          this.getqueryByTrainTickets()
        }
      },
      createSearch() {
        // console.log(this.$route.path);
        // bus.$emit("tags",'orderqueryss');
        window.open(
          "http://172.16.7.51:7777/#/train/trainReserve", //需要跳转的路由
          "_blank", //是否在新的页面打开
          "width=1500,height=800,toolbar=no"
        );
      },
      // 表单回车跳转下一个
      accountLogin(nextRef) {
        this.$refs[nextRef].focus();
      },
      prompt() {
        this.$confirm("没有符合条件的车次信息！！", "提示", {
          confirmButtonText: "确定",
          type: "warning",
        });
      },
      loadAll() {
        let arr = this.cityList;
        let arr1 = [];
        arr.forEach((item) => {
          item.cityNameLists.forEach((items) => {
            let obj = {
              value: items.stationName + '-' + items.trainStationJianPinYin + '-' + items.trainStationPinYin,
              label: items.stationName
            };
            arr1.push(obj);
          });
        });
        this.restaurants = arr1
        this.restaurants2 = arr1
        this.restaurants3 = arr1
        console.log(this.restaurants)
      },
      createFilter(queryString) {
        return (restaurant) => {
          return (
            restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
            0
          );
        };
      },
      onSubmit(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.showLoading();
            this.getqueryByTrainTickets();
          } else {
            return false;
          }
        });
      },
      cityChange() {},
      cityChange1() {},
      // 经停时间转换
      runtime(val) {
        let val1 = val.split(":");
        let val2 = val1[0] + "时" + val1[1] + "分";
        return val2;
      },
      // 展开收起
      btnClick() {
        this.open = !this.open;
      },
      // 获取城市列表
      getCityList() {
        this.$axios.getCityList().then((res) => {
          if (res.code == "00000") {
            console.log(res)
            this.cityList = res.data;
            this.cityLists = res.data;
            this.loadAll();
          }
        });
      },
      // 拼音
      pinyingMatch(val) {
        if (val) {
          var result = []
          this.restaurants2.forEach(e => {
            var m = pinyingMatch.match(e.value, val)
            if (m) {
              result.push(e)
            }
          })
          this.restaurants = result
        } else {
          //没有搜索到数据，就还展示所有的brand 
          this.restaurants = this.restaurants3
        }
      },
      desChange() {
        this.confirm();
      },
      arrChange() {
        this.confirm();
      },
      inputResource(val,key){
        console.log(val,key)
        let parentObjArr = [];
        if(key === "resource"){
         parentObjArr = this.timeList
        }else{
         parentObjArr = this.timeList1
        }
        this.timeFilter[key] = parentObjArr.filter(item=> {
          if(item.time1===val) return item
        })[0];
        this.confirm();
      },
      getshow(index) {
        let list = this.list;
        list[index].is = !list[index].is;
        this.list = [].concat(list) ;
        this.confirm();
      },
      confirm() {
        // 出发站
        let depart = this.form.start;
        // 到达
        let arrive = this.form.arrives;
        let list = this.rawlist;
        // 出发站的筛选
        let arr = list.filter((item) => {
          return item.from_station_name == depart || depart == "不限";
        });
        let arr1 = arr.filter((item) => {
          return item.to_station_name == arrive || arrive == "不限";
        });
        // 座位筛选
        let arr2 = [];
        arr2 = arr1;
        let arr3 = arr2.filter(function (elem, pos, self) {
          return self.indexOf(elem, pos + 1) === -1; //去重
        });
        // 车次筛选
        let arr4 = this.coomonttrain(arr3);
        // 筛选是否有票
        let arr5 = this.gettrainis(arr4);
        this.train = arr5;
      },
      // 是否仅有票
      gettrainis(row) {
        let list = [];
        if (this.trainis) {
          row.map((item) => {
            if (
              (item.ydz_num == "--" || item.ydz_num == 0) &&
              (item.edz_num == "--" || item.edz_num == 0) &&
              (item.yz_num == "--" || item.yz_num == 0) &&
              (item.rw_num == "--" || item.rw_num == 0) &&
              (item.yw_num == "--" || item.yw_num == 0) &&
              (item.gjrw_num == "--" || item.gjrw_num == 0) &&
              (item.wz_num == "--" || item.wz_num == 0) &&
              (item.tdz_num == "--" || item.tdz_num == 0) &&
              (item.swz_num == "--" || item.swz_num == 0)
            ) {} else {
              list.push(item);
            }
          });
          return list;
        } else {
          return row;
        }
      },
      coomonttrain(arr3) {
        // 车次筛选
        let train = [],isArr = [],linshiArr = [],otherStatus = false;
        let timeFilter = this.timeFilter;
        this.list.map((item) => {
          if (item.is == true) {
            isArr.push(item.is)
            train.push(item.type);
            if(!linshiArr.length) linshiArr =[].concat(item.linshiType);
            if(item.id == 3) otherStatus = true;
          }
        });
        console.log(otherStatus)
        let trains = train.flat();
        let arr4 = [];
        // 区间筛选
        if (Object.keys(timeFilter).length){
          arr3 = arr3.filter((item)=>{
            let start_timeNum = item.start_time.split(":").join("")*1;
            let arrive_timeNum = item.arrive_time.split(":").join("")*1;
            let startStatus = true, arriveStatus = true;
            if(timeFilter.resource) startStatus = start_timeNum>=timeFilter.resource.time && start_timeNum<=timeFilter.resource.times;
            if(timeFilter.resource1) arriveStatus = arrive_timeNum>=timeFilter.resource1.time && arrive_timeNum<=timeFilter.resource1.times;
            if(startStatus && arriveStatus) return item;
          })
        }
        if (isArr.length == 3) trains.length = 0;
        if (trains.length) {
          if(!otherStatus){
            for (let z = 0; z < trains.length; z++) {
              arr3.map((item, index) => {
                if (item.train_type == trains[z]) {
                  arr4.push(item);
                  // console.log(item.train_code)
                }
              });
            }
          }else{
            console.log(linshiArr);
            arr3.map((item, index) => {
              if (linshiArr.indexOf(item.train_type)<0) {
                arr4.push(item);
              }
            });
          }
        } else {
          arr4 = arr3;
        }
        return arr4;
      },
      closeLoading() {
        this.tableLoading.close();
      },
      // 查询火车票
      getqueryByTrainTickets() {
        this.$axios
          .getqueryByTrainTickets({
            fromStationName: this.form.depart,
            toStationName: this.form.arrive,
            train_date: this.form.traintime,
            // 始发 路过  不限
            type: this.form.originating == "" ? null : this.form.originating
          })
          .then((res) => {
            this.closeLoading();
            if (res.code == "00000" && res.success) {
              // 出发车站
              let arr = res.data;
              let departureList = ["不限"];
              arr.map((item) => {
                departureList.push(item.from_station_name);
                item.is = false;
              });
              // 到达车站
              let arr2 = res.data;
              let destinationList = ["不限"];
              arr2.map((item) => {
                destinationList.push(item.to_station_name);
                item.is = false;
              });
              this.departureList = [...new Set(departureList)];
              this.destinationList = [...new Set(destinationList)];
              if(this.type =="change"){
                this.train = arr2.filter(item => {
                  return item.from_station_name == this.$route.params.mes.depart
                })
                this.rawlist = res.data;
              }else{
                this.rawlist = res.data;
                this.train = this.coomonttrain(res.data);
              }
              console.log(this.train, this.rawlist);
            } else {
              this.destinationList = []
              this.departureList=[]
              this.rawlist = [];
              this.train = [];
              this.prompt();
            }
          });
      },
      current(type) {
        var date = new Date();
        var year = date.getFullYear(); //年 ,从 Date 对象以四位数字返回年份
        var month = date.getMonth() + 1; //月 ,从 Date 对象返回月份 (0 ~ 11) ,date.getMonth()比实际月份少 1 个月
        var day = date.getDate(); //日 ,从 Date 对象返回一个月中的某一天 (1 ~ 31)

        var hours = date.getHours(); //小时 ,返回 Date 对象的小时 (0 ~ 23)
        var minutes = date.getMinutes(); //分钟 ,返回 Date 对象的分钟 (0 ~ 59)
        var seconds = date.getSeconds(); //秒 ,返回 Date 对象的秒数 (0 ~ 59)

        if (type == 1) {
          //获取当前系统时间
          var currentDate = year + "-" + month;
          return currentDate;
        } else if (type == 2) {
          //获取当前系统时间
          var currentDate = year + "年" + month + "月";
          return currentDate;
        } else if (type == 3) {
          //获取当前系统时间   (月-日)
          var currentDate = month + "-" + day;
          return currentDate;
        } else if (type == 4) {
          var month = month.toString().padStart(2, "0");
          var day = day.toString().padStart(2, "0");
          //获取当前系统时间   (年-月-日)
          var currentDate = year + "-" + month + "-" + day;
          return currentDate;
        } else if (type == 5) {
          var month = month.toString().padStart(2, "0");
          var day = day.toString().padStart(2, "0");
          var hours = hours.toString().padStart(2, "0");
          var minutes = minutes.toString().padStart(2, "0");
          var seconds = seconds.toString().padStart(2, "0");
          //获取当前系统时间
          var currentDate =
            year +
            "-" +
            month +
            "-" +
            day +
            " " +
            hours +
            ":" +
            minutes +
            ":" +
            seconds;
          return currentDate;
        } else {
          //获取当前系统时间
          var currentDate =
            year +
            "-" +
            month +
            "-" +
            day +
            " " +
            hours +
            ":" +
            minutes +
            ":" +
            seconds;
          return currentDate;
        }
      },
      // 经停信息查询
      trainDetails(item, index) {
        this.train.forEach((trainItem,trainIndex)=>{
          if(trainIndex == index)trainItem.is = !trainItem.is;
          else trainItem.is = false;
        })
        this.$axios
          .gettrainTransit({
            fromStationName: this.form.depart,
            toStationName: this.form.arrive,
            train_date: this.form.traintime,
            train_code: item.train_code,
          })
          .then((res) => {
            if(res.code=="00000"){
              if (res.data.code == "200") {
                let list = res.data.data[0].data;
                list.map((item) => {
                  item.is = "wei";
                });
                let cur = this.current(5);
                let j = 0;
                for (let i = 0; i < list.length; i++) {
                  // 当前到站
                  let time = this.traintime + " " + list[i].arrive_time + ":00";
                  if (time < cur) {
                    j++;
                    list[i].is = "guo";
                  } else {
                    list[i].is = "wei";
                  }
                  if (i == list.length - 1) {
                    if (j == 0) {
                      list[i].is = "wei";
                    } else {
                      list[j - 1].is = "dang";
                    }
                  }
                }
                this.transitlist = list;
              }
            }
          });
      },      
      showLoading() {
        this.tableLoading = this.$loading({
          text: "拼命加载数据中", //显示在加载图标下方的加载文案
          spinner: "el-icon-loading", //自定义加载图标类名
          background: "rgba(0, 0, 0, 0.4)", //遮罩层颜色
          target: document.querySelector("#table"), //loadin覆盖的dom元素节点
        });
      },
      generate(item, generate, price,zwcode) {
        if (this.type != "") {}
        if (this.type == "change") {
          console.log(this.arr);
          // debugger
          this.changeOrder = true;
          (this.arr.depart = this.form.depart),
          (this.arr.arrive =  item.to_station_name);
          (this.arr.train_code = item.train_code),
          (this.arr.train_date = this.form.traintime);
          this.$router.push({
            name: "generate",
            params: {
              train: this.arr,  
              passenger: this.$route.params.passenger,
              type: "change",
              go: this.go,
              mes: this.$route.params.mes,
              Reclinedtablname: generate,
              price,
              zwcode
            },
          });
        } else {
          (this.arr.depart = item.from_station_name),
          (this.arr.arrive = item.to_station_name),
          (this.arr.train_code = item.train_code);
          this.arr.train_date = this.form.traintime;
          console.log(price)
          this.$router.push({
            name: "generate",
            params: {
              train: this.arr,
              Reclinedtablname: generate,
              price,
              zwcode
            }
          });
          this.centerDialogVisible = true;
        }
      },
    },
    mounted() {
      //  window.location.reload();
      this.go = this.$route.params.go;
      if (this.type == "change") {
        (this.form.depart = this.$route.params.mes.depart),
        (this.form.arrive = this.$route.params.mes.arrive);
        this.getCityList();
      } else {
        this.getCityList();
      }
    },
  };
</script>

<style scoped>
  .trainReserve {
    margin: 30px 0px 0px 100px;
    /* margin: 50px 0 0 173px; */
  }

  .screen {
    display: flex;
  }

  .el-form-item {
    margin-bottom: 0px;
  }

  .see {
    border-bottom: 0px !important;
  }

  .screen1 {
    border-bottom: 1px dashed #cccccc;
  }

  .screen2 {
    /* width: 600px; */
  }

  .screen3 {
    display: flex;
    /* flex-direction: column; */
    align-items: flex-end;
  }

  .train {
    width: 70%;
    min-width: 674px;
    margin-top: 20px;
    font-size: 13px;
  }

  .train_o {
    background: #f0f0f0;
    line-height: 30px;
    width: 100%;
  }

  .train_o>span {
    width: 14%;
    padding-left: 13px;
    display: inline-block;
  }

  .details {
    display: flex;
  }

  .details>div {
    line-height: 40px;
    width: 111px;
  }



  .det_tw {
    display: flex;
    flex-direction: column;
  }

  

  .det_fo {
    line-height: 30px;
  }

  .det_fi {
    line-height: 30px;
  }

  .det_s {
    line-height: 30px;
  }

  .details_x {
    color: #3b8de7;
    cursor: pointer;
  }

  .days {
    font-size: 13px;
    color: #3b8de7;
  }



  .num>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }


  .daysed {
    display: flex;
  }



  .btns {
    width: 20px;
    height: 15px;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }



  .stop {
    background: #f0f0f0;
    line-height: 30px;
    width: 100%;
  }

  .stop>span {
    width: 17%;
    padding-left: 13px;
    display: inline-block;
  }

  .stop_mes {
    line-height: 24px;
  }

  .stop_mes>span {
    width: 17%;
    padding-left: 13px;
    display: inline-block;
  }

  .screen4 {
    width: 80%;
    min-width: 804px;
    margin-top: 20px;
  }

  .a-register {
    cursor: pointer;
    color: #24b6ef;
    background-color: #fff;
    border: none;
  }

  .input1 {
    margin: 30px 0;
    display: flex;
    height: 40px;
    line-height: 40px;
  }

  .input {
    width: 400px;
  }

  .btn-div {
    width: 100%;
    text-align: center;
  }

  .read {
    text-align: center;
    margin-bottom: 30px;
  }

  .read>a {
    margin: 0 10px;
    text-decoration: none;
    color: #01aaed;
  }
</style>